<template>
  <div>
    <search @search="handleSearchByKeyword" />
      <ms-table @rowClick="handleRowClick" :table-props="tableProps" :data-api="dataUrl" ref="dataTable">
        <el-table-column label="操作" slot="tool">
          <template slot-scope="scope" v-if="scope.row.perimission != 'admin'">
            <el-button
              size="mini"
              @click="handleOpenDialog(scope.row.roleId)">编辑</el-button>
            <el-button
              size="mini"
              type="danger"
              >删除</el-button>
          </template>
        </el-table-column>
      </ms-table>
      <info :title="title" ref="infoForm" :dialog-visible="dialog1" :form-id="formId" @dataFresh="handleCanleDialog" @close="handleCanleDialog" />
  </div>
</template>

<script>
import { MsTable } from '@/common/table'
import Search from './Search'
import Info from './Info'
import common from '@/mixins/common'
export default {
  components: {
    MsTable,
    Search,
    Info
  },
  mixins: [common],
  data() {
    return {
      tableProps: [
        { index: 'name', label: '角色名称' },
        { index: 'perimission', label: '权限标识' },
        { index: 'createTime', label: '创建时间' }
      ],
      dataUrl: '/sys/role/list',
      mainTitle: '角色'
    }
  },
  methods: {
    handleRowClick(val) {
      const { roleId, perimission } = val[0]
      this.$emit('clickRow', roleId, perimission)
    }
  }
}
</script>
